body,input,img,p,label{
    margin:0;
    padding:0;
}
input{
    outline:none;
    border:none;
}
.header{
    width:100vw;
    height:44px;
    background:rgba(250,250,250,1);
    padding:0 8px 0 12px;
    box-sizing:border-box;
    display:flex;
    justify-content:space-between;
    align-items:center;
    .header-left{
        font-size:24px;
    }
    .header-left{
        width:24px;
        height:22px;
        background:url(./assets/images/spirit.webp) no-repeat 0 -34px/80px;
    }
    .header-middle{
        width:86px;
        height:27px;
        background:url(./assets/images/spirit.webp) no-repeat 0 -62px/cover;
        margin-left:40px;
    }
    .header-right{
        display:flex;
        span{
            display:block;
            width:32px;
            height:32px;
        }
        span:nth-child(1){
            background:url(./assets/images/spirit.webp) no-repeat 0 -167px/80px;
        }
        span:nth-child(2){
            background:url(./assets/images/spirit.webp) no-repeat 0 -2px/80px;
            margin-left:10px;
        }
    }
}
.login{
    width:100vw;
    padding:0 20px;
    box-sizing:border-box;
   img{
       display:block;
       width:134px;
       height:45px;
       margin:30px auto;
   }
    .phone{
        width:100%;
        margin-bottom:20px;
        display:flex;
        justify-content:space-between;
        border-bottom:1.4px solid rgba(240,240,240,1);
        input{
            width:190px;
            height:45px;
            font-size:16px;
            color:#666666;
            &::-webkit-input-placeholder { 
                font-size:14px;
                color:#666666;  
              }  
              &:-moz-placeholder { 
                font-size:14px;
                color:#666666;   
              }  
              &::-moz-placeholder { 
                font-size:14px;
                color:#666666;  
              }  
              &:-ms-input-placeholder {
                font-size:14px;
                color:#666666;  
              } 
        }
    }
    .code{
       @extend .phone;
        span{
            display:block;
            width:82px;
            height:26px;
            border:1px solid #cccccc;
            font-size:14px;
            color:#333333;
            line-height:26px;
            text-align:center;
            border-radius:2px;
        }
    }
    .login-other{
        width:100%;
        display:flex;
        justify-content:space-between;
        div:nth-child(1){
            font-size:14px;
            color: #7f7f7f;
        }
        div:nth-child(2){
            font-size:14px;
            color:#333333;
        }
    }
    .login-btn{
        width:100%;
        height:46px;
        background:#DD1A21;
        font-size:14px;
        color:#ffffff;
        line-height:46px;
        text-align:center;
        margin:20px 0 10px 0;
        border-radius:3px;
    }
    .login-clause{
        width:100%;
        display:flex;
        div:nth-child(1){
            width:14px;
            height:14px;
            position:relative;
            background:pink;
            margin-right:6px;
            label{
                width:100%;
                height:100%;
                position:absolute;
                top:0;
                left:0;
                z-index:100;
                display:block;
                border:1px solid #cccccc;
                background-color:#ffffff;
                text-align:center;
                line-height:14px;
                color:#cccccc;
                font-size:10px;
            }
            input{
                position:absolute;
                top:0;
                left:0;
            }
        }
        div:nth-child(2){
            display:flex;
            font-size:12px;
            color:#7f7f7f;
            span{
                margin-right:6px;
            }
            span:nth-child(2){
                color:#007aff;
            }
            span:nth-child(4){
                color:#007aff;
            }
        }
    }
    .login-else{
        width:100%;
        margin-top:30px;
        text-align:center;
        font-size:14px;
        color:#333333;
    }
    .alarm{
        width:100%;
        color:#DD1A21;
        font-size:12px;
        margin-bottom:10px;
        transition:all 400s linear;
    }
}